
<template>
    <view class="newgood">
        <view class="">
            <u--form :model="form" ref="uForm" :rules="rules">
                <u-form-item label="商品类型" prop="radioName" borderBottom @click="showgotoTree">
                    <view class="select vh-c">
                        <u--input v-model="form.radioName" disabled disabledColor="#ffffff" placeholder="请选择商品类型" border="none"></u--input>
                        <u-icon slot="right" name="arrow-right"></u-icon>
                    </view>
                </u-form-item>
                <u-form-item label="商品名称" prop="name">
                    <u--input v-model="form.name" @input="changeinput($event,'name')" />
                </u-form-item>
                <u-form-item label="商品描述" prop="content">
                    <u--textarea v-model="form.content" autoHeight @input="changeinput($event,'content')" />
                </u-form-item>
                <u-form-item label="商品图片" prop="images">
                    <view class="u-demo-block shigongimgs">
                        <!-- <text class="u-demo-block__title">隐藏上传按钮</text> -->
                        <view class="u-demo-block__content">
                            <view class="u-page__upload-item">
                                <!-- :maxCount="2" -->
                                <u-upload :fileList="imagesList" @afterRead="afterRead" @delete="deletePic" name="4" multiple :maxCount="3">
                                </u-upload>
                            </view>
                        </view>
                    </view>
                </u-form-item>

                <u-form-item label="规格" prop="format">
                    <u--input v-model="form.format" @input="changeinput($event,'format')" />
                </u-form-item>
                <u-form-item label="库存" prop="stock">
                    <u--input v-model="form.stock" type="number" @input="changeinput($event,'stock')" />
                </u-form-item>
                <u-form-item label="价格" prop="price">
                    <input class="uni-input" v-model="form.price" name="input" @input="changeinput($event,'price')" @blur="money($event,'price')"
                        type="digit" placeholder="请输入" />
                </u-form-item>
                <u-form-item label="返现金额" prop="cashBack">
                    <input class="uni-input" v-model="form.cashBack" name="input" @input="changeinput($event,'cashBack')"
                        @blur="money($event,'cashBack')" type="digit" placeholder="请输入" />
                </u-form-item>
            </u--form>
            <u-button @click="submit1">提交</u-button>
        </view>
        <view>
            <u-overlay :show="show" @click="show = false">
                <view class="fenlei" @tap.stop>
                    123
                </view>
            </u-overlay>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {


            form: {
                name: '',
                content: '',
                radioName: '',
                images: '',
                format: '',
                stock: '',
                price: '',
                cashBack: '',
            },
            rules: {
                content: [{
                    required: true, message: '请输入',
                    trigger: ['blur', 'change']
                }],
                name: [{ required: true, message: '请输入' }],
                radioName: [{ required: true, message: '请选择' }],
                images: [{ required: true, message: '请上传' }],
                format: [{ required: true, message: '请输入' }],
                stock: [{ required: true, message: '请输入' }],
                price: [{ required: true, message: '请输入' }],
                cashBack: [{ required: true, message: '请输入' }],
            },
            imagesList: [],


            treeList: [],
            checkList: [],
            showSex: false,
            model1: {
                userInfo: {
                    name: '',
                    sex: '',
                },
            },
            actions: [{
                name: '男',
            },
            {
                name: '女',
            },
            {
                name: '保密',
            },
            ],
            radio: '',
            switchVal: false,
            radioName: ''
        };
    },

    //页面显示
    onShow(object) {
        if (object) {

            this.form.assortId = JSON.stringify(object.radioId)
            this.form.radioName = object.radioName

            this.$forceUpdate()
            // this.bml = object.bml
            // this.bmlid = object.bmlid
        }
    },

    methods: {
        changeinput(value, machIndex) {
            this.from[machIndex] = value
            this.$forceUpdate()
        },
        submit1() {
            this.$refs.uForm.validate().then(res => {
                console.log(this.form)
                let param=JSON.parse(JSON.stringify(this.form))
                param.images = param.images.join(',')
                console.log(param)
                this.$http.post('promotion/goodsInfo', param).then(val => {
                    if (val.code == 200) {
                        uni.showToast({
                            title: val.message,
                            icon: "success",
                            duration: 2000
                        });
                        uni.navigateBack();
                    }
                    else {
                        uni.showToast({
                            title: val.message,
                            icon: "none",
                            duration: 2000
                        });
                    }
                })

                // uni.$u.toast('校验通过')
            }).catch(errors => {
                console.log(errors)
                uni.$u.toast('请补全信息')
            })
        },

        showgotoTree() {
            console.log('aaa')
            uni.navigateTo({
                url: '/pages/chooseUser/chooseUser'
            })
        },
        sexSelect(e) {
            this.model1.userInfo.sex = e.name
            this.$refs.form1.validateField('userInfo.sex')
        },
        getTreeBy(value) {
            console.log(value)
            this.$http.get('promotion/assort/get_tree_by/' + value).then(val => {
                console.log(val)
                this.treeList = val.data
            })
        },
        // 删除图片
        deletePic(event) {
            this.imagesList.splice(event.index, 1)
            this.form.images.splice(event.index, 1)
        },
        // 新增图片
        async afterRead(event) {
            // 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
            let lists = [].concat(event.file)
            let fileListLen = this.imagesList.length
            lists.map((item) => {
                this.imagesList.push({
                    ...item,
                    status: 'uploading',
                    message: '上传中'
                })
            })
            for (let i = 0; i < lists.length; i++) {
                const result = await this.uploadFilePromise(lists[i].url)
                let item = this.imagesList[fileListLen]
                this.imagesList.splice(fileListLen, 1, Object.assign(item, {
                    status: 'success',
                    message: '',
                    url: result
                }))
                fileListLen++
            }
        },
        uploadFilePromise(url) {
            console.log(url)
            let that = this
            return new Promise((resolve, reject) => {
                let a = uni.uploadFile({
                    url: that.$base.baseUrl + "sys/common/upload", // 仅为示例，非真实的接口地址
                    filePath: url,
                    name: 'file',
                    header: {
                        "token": uni.getStorageSync("userInfo").token //token校验
                    },
                    success: (res) => {
                        console.log(res)
                        that.form.images = that.form.images ? that.form.images : []
                        that.form.images.push(JSON.parse(res.data).data)
                        console.log(that.form)
                        resolve(res.data.data)
                    }
                });
            })
        },

        money(e, key) {
            let v = e.detail.value
            console.log(e.detail.value);
            let reg = /^([0]|([1-9][0-9]*)|(([0]\.\d{1,}|[1-9][0-9]*\.\d{1,})))$/
            if (!reg.test(v)) {
                console.log('1')
                this.form[key] = ''
                this.$forceUpdate()
                return
            }
            reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/
            if (!reg.test(v)) {
                console.log('2')
                // this.form[key] = ''
                // v.splice('.')
                this.form[key] = v.substring(0, v.indexOf(".") + 3);
                console.log(v.substring(0, v.indexOf(".") + 3))

                this.$forceUpdate()
                return
            }
        },
    },
};
</script>
<style lang="scss">
.newgood {
    min-height: 100vh;
    background-color: #fff;
    padding: 0rpx 40rpx 40rpx 40rpx;
    .u-form-item {
        border: none;
    }
    .u-upload__wrap__preview__image,
    .u-upload__button {
        width: 200rpx !important;
        height: 200rpx !important;
    }
    .u-upload__deletable {
        width: 50rpx !important;
        height: 50rpx !important;
        text {
            top: 20rpx !important;
            font-size: 40rpx !important;
        }
    }
    .u-input__content {
        padding: 20rpx;
    }
    .u-border {
        border: none !important;
    }
    .u-line {
        display: none;
    }
    .u-form-item__body__right__message {
        margin-left: 0 !important;
    }
    .u-form-item__body {
        display: block !important;
    }
    .u-input--square,
    .select {
        margin: 0 !important;
        background: #f8f8f8 !important;
        padding: 0 !important;
    }
    .u-form-item__body__left__content__label {
        white-space: nowrap;
        font-size: 36rpx !important;
        font-weight: 600 !important;
        color: #000000 !important;
        line-height: 50rpx !important;
        margin: 20rpx 0 !important;
    }
    .u-input,
    .u-textarea,
    .uni-input {
        margin-top: 20rpx;
        background: #f8f8f8 !important;
        border-radius: 8rpx;
        border: none;
        line-height: 50rpx !important;
        height: 88rpx;

        // padding: 20rpx !important;
    }
    .uni-input {
        // line-height: 26px;
        padding: 0 20rpx;
    }

    .u-picker__view__column,
    .u-picker__view {
        height: 40vh !important;
    }
    .shigongimgs {
        margin-bottom: 40rpx;
        .uicon-camera-fill {
            font-size: 60rpx !important;
        }
    }
    .fenlei {
        width: 100vw;
        height: 100vh;
    }
}
</style>